اصول ساخت سایت
وبسایت برای استفاده کننده (انسان) طراحی میشود. درواقع، طراح وبسایت باید قالبی برای تعامل با آدم (کاربر) طراحی کند. به این نکتهی بسیار اصلی هم اعتنا فرمایید که تعامل با کاربر می بایست تعاملی رضایتبخش باشد. یعنی طراح وبسایت بایستی تجربهای و تعاملی برای مخاطب بسازد که اثر گذار و لذتقسمت هست. براین اساس، میشود اینطور منفعت گرفت که هدف اصلی و اولیهی هر سایتی ارتباط برقرارکردن با بازدیدکننده هست.
زمانی ارتباط اول شکل گرفت و سایت آنقدر جالب بود که بازدیدکننده آن را رخنه نکرد، وهله می رسد به اینکه کاربر تشویق شود تا در تارنما کاری اعمال دهد. اگر سایت فروشگاهی باشد، استفاده کننده بایستی متقاعد شود که از آن خرید کند. در حالتی که وب سایت محتوایی باشد، مخاطب بایستی در وبسایت بچرخد و محتواهای گوناگون را ببیند و درصورتیکه تبلیغی در وب سایت قرار گرفته می باشد روی آن کلیک کند.
در شرایطی که کاربر از تجربیاتی خرید از تارنما یا از محتواهایی که در وبسایت خوانده هست، راضی باشد، دوباره به وبسایت میاید و از آن بازدید میکند. این صحت دارد که همگیی اجزای تعامل رضایتبخش استفاده کننده با متاع را طراح سایت نمیسازد و باید از متخصصان دیگر (طراح رابط کاربری، طراح تجربیات کاربری و ازهمه مهمتر طراح فرآورده) نیز کمک بگیرد، ولی نکته اینجاست که طراح وب سایت است که باید تمامیچیز را درکنار یکدیگر قرار دهد و سایتی بسازد که قشنگ، کاربردی، سریع، امن و بدون خلل فنی باشد.
دراینجاست که اصول ساخت وب سایت به طراح و پیشرفتدهنده یاری میکند تا سایتی مهیا کند که هم جذاب و کاربردی و هم ایمن و سریع باشد.
مهمترین و کاربردی ترین اصول در وب طراحی صفحه
گذشتهاز پرداختن به اصول وب صفحه ارایی، بهاین نکته بایستی اشاره کنم که تعداد اصول طراحی وبسایت اختلافی هست. یعنی در منابع از اصول مختلفی نام برده شدهاست. درادامه، مهمترین اصول که در بیشتر منابع ذکر شده و برای طراحی وبسایت غالب و حرفهای ما یحتاج می باشد، معرفی میشود.
۱. در همه روند وب صفحه ارایی اهداف وبسایت می بایست درنظر گرفته شود
همانطور که اشاره کردم، هر سایتی رسیدن به اهدافی را دنبال میکند. بعضیاز اهداف مشترک در میان کلیهی وب سایتها می باشند (جذبکردن بازدیدکننده و ساختن تعامل رضایتبخش). بعضی اهداف دیگر براساس قضیه سایت مشخص می گردد:
چنانچه وب سایت سرگرمی و ویدئویی باشد، هدفش این است که تا می گردد بازدیدکننده را در سایت نگه دارااست.
درصورتیکه وب سایت فروشگاهی است، هدفش تبدیلکردن بازدیدکننده به مشتری و ارتقا فروش هست.
چنانچه سایت برای یک برند خاص طراحی می گردد و قرار هست آن کسبوکار و برند را نام گذاری کند، هدف سایت محافظت اعتبار و رده برند و همچنین معرفی کامل و درست آن کسبوکار می باشد.
۲. تارنما را نباید با هر محتوایی پر کرد
سایت در شرایطیکه جذابترین طراحی صفحه را داشته باشد ولی از محتوای مفید و کاربردی برای بازدیدکننده (یعنی محتوایی که برای کاربرش مهم هست و مخاطب برای دیدن و پیداکردن آن به وب سایت میآید) تهی باشد، غالب نخواهد شد. محتوای هر وب سایت بخشی از وب سایت میباشد و درنتیجه طراح تارنما می بایست بهاین مورد هم اعتنا کند که در سایت محتوای درست و مناسب باهدف آن قرار گیرد. دراینجاست که اصل اول به طراح امداد میکند: محتوای سایت باید مناسب باهدف سایت و همچنین کاربران وبسایت باشد. محتوای تارنما فروشگاهی با وبسایت خبری فرق دارد، چون هدف و مخاطبان تارنما فروشگاهی و خبری باهم فرق داراهستند.
۳. طراحی وب بایستی بی آلایش و اصیل باشد
هنگامی طراح وب سایت متوجه شد قرار می باشد با طراحی به چهچیزی برسد و نوع و کیفیت محتوای سایت را نیز مشخص و معلوم کرد، می بایست راجع به صفحه ارایی کلی و ساختار کلی تارنما تصمیم بگیرد. برای این تصمیمگیری طراح وبسایت باید بهیاد داشته باشد که اولا از سایتهای مشابه تقلید نکند و دوما ساختاری بی آلایش و نهچندان بغرنج را برای وب سایت درنظر بگیرد.
صراحت دارد که بیشتر سایتهای فروشگاهی یا خبری قالب مشابهی داراهستند، ولی وب دیزاینر باید خلاقانه از قالب و دیگر وب سایتهای مشابه و رقیب فاصله بگیرد. به دو تصویر زیر نگاه نمائید. هر دو متعلق به کاغذی اول دو تارنما خبری معتبر در فقید میباشند. شباهتهایی در دو سایت وجود داراست، اما هر مورد صفحه آرایی منحصر به فردبه خودشان را دارند. هر دو وبسایت ساختار بی آلایشای دارند که بازدیدکننده در یک نگاه آن را شعور میکند.
۴. وب طراحی صفحه باید براساس اصول طراحی رابط کاربری و طراحی تجربیات کاربری باشد
فلسفهی طراحی رابط کاربری و تجربه کاربری در وبسایت این میباشد که سایت براساس ترجیحات کاربر و آنطور که او تعامل و فهم شل و ولتر و سادهتری با یک وب سایت و قسمتهای گوناگون آن دارد، صفحه ارایی گردد. به عنوان مثال، سیستم Navigation یا ناوبری در تارنما بسیار اهمیت دارد. چون مستقیما بهاین مربوط میشود که کاربر چطور بخشهای گوناگون وب سایت را پیدا کند. در صورتیکه ناوبری در سایت و منوها حیرانکننده طراحی شده باشند، استفاده کننده چیزی را که میخواهد پیدا نمیکند و ناراضی تارنما را رخنه میکند. وب دیزاینر می تواند باکمکبه دست آوردن از طراح رابط کاربری و تجربه کاربری بهراحتی ناوبری سایت را طراحی کند. درواقع:
طراحی UI/UX رویه را برای طراح وبسایت باز میکند و به او نماد میدهد که برای دیزاین بصری و گزینش و به کارگیری از المانهای بصری سایت ازجمله رنگها، آیکونها، دکمهها، CTAها، فضاهای خالی، عکسها و گرافیکها، و همچنین طراحی منوها، تیمبندی تولیدات یا بخشهای مختلف وبسایت، طراحی سلسلهمراتب بصری و حتی متنها چهطور باید شغل کند تا تعامل کاربر با سایت به بهترین شکل انجام شود.
به تصویر تحت نگاه فرمایید. چه میبینید؟ دستهای حیرانکننده از المانهای مختلف که بیهیچ قاعده و تناسبی فقط کنار یکدیگر قرار گرفتند. رنگها، فونتها و سایز فونتهای استفادهشده قشنگ و جالب و متناسب نیستند. این وب سایت نمونهای از وبسایتی میباشد که فارغ ازدقت به هر ۴ مهم که تاکنون گفته شد، ساخته شده است. هر کاربری که وارد این وبسایت شود، مطلقا برای یکسری لحظه ماتومبهوت به همهچیز نگاه میکند. وقتی سایتی بیاعتنا به اصول طراحی صفحه گردد، استفاده کننده را گیج میکند و او را وادار میکند تا درنگ کند و وقت بگذارد تا چیزی را که میخواهد در آن پیدا کند.
۵. بااستفادهاز سیستم گرید در طرحبندی صفحات سایت هارمونی و نظم ایجاد می گردد
مغز و چشم انسان هارمونی، نظم، تقارن و تناسب میان چیزها (المانها) را ادراک میکند و دوست دارد. از مهمترین موضوعات در طرحبندی صفحه های سایت (Page layout) این می باشد که محتوا و دیگر المانهای بصری چه گونه درکنار یکدیگر چیده شوند تا کلیهچیز ساختارمند و منظم بهحیث برسد.
طرحبندی برگه و طریقای که وب دیزاینر برای آن استفاده میکند علاوهبر هارمونی و نظم بخشیدن به برگه، خواندن محتوا را برای کاربر راحت میکند. ازطرف دیگر، طراحی صفحه اصولی سایت به seo تارنما هم کمک میکند. برای گوگل، طرحبندی تارنما آنقدر اساسی می باشد که الگوریتمی به نام Page Layout دارد.
طراح تارنما از شیوهای مختلفی برای طرحبندی صفحه های سایت میتواند استفاده کند. اما بهترین گزینه این میباشد که از سیستم گرید (Grid based layout) امداد بگیرد. در سیستم گرید، شیت به دستهای از ستونها و ردیفها تقسیم میگردد. در هر ستون و ردیف هم Containerهایی برای قرارگرفتن المانها وجود دارد. طراح تارنما می تواند در هر Container المانها را درکنار یکدیگر بچیند.
دو تصویر زیر را نگاهی فرمایید. متوجه تفاوت در طرحبندی صفحهاول این دو تارنما شدید؟
اصول ساخت سایت
وبسایت برای استفاده کننده (انسان) طراحی میشود. درواقع، طراح وبسایت باید قالبی برای تعامل با آدم (کاربر) طراحی کند. به این نکتهی بسیار اصلی هم اعتنا فرمایید که تعامل با کاربر می بایست تعاملی رضایتبخش باشد. یعنی طراح وبسایت بایستی تجربهای و تعاملی برای مخاطب بسازد که اثر گذار و لذتقسمت هست. براین اساس، میشود اینطور منفعت گرفت که هدف اصلی و اولیهی هر سایتی ارتباط برقرارکردن با بازدیدکننده هست.
زمانی ارتباط اول شکل گرفت و سایت آنقدر جالب بود که بازدیدکننده آن را رخنه نکرد، وهله می رسد به اینکه کاربر تشویق شود تا در تارنما کاری اعمال دهد. اگر سایت فروشگاهی باشد، استفاده کننده بایستی متقاعد شود که از آن خرید کند. در حالتی که وب سایت محتوایی باشد، مخاطب بایستی در وبسایت بچرخد و محتواهای گوناگون را ببیند و درصورتیکه تبلیغی در وب سایت قرار گرفته می باشد روی آن کلیک کند.
در شرایطی که کاربر از تجربیاتی خرید از تارنما یا از محتواهایی که در وبسایت خوانده هست، راضی باشد، دوباره به وبسایت میاید و از آن بازدید میکند. این صحت دارد که همگیی اجزای تعامل رضایتبخش استفاده کننده با متاع را طراح سایت نمیسازد و باید از متخصصان دیگر (طراح رابط کاربری، طراح تجربیات کاربری و ازهمه مهمتر طراح فرآورده) نیز کمک بگیرد، ولی نکته اینجاست که طراح وب سایت است که باید تمامیچیز را درکنار یکدیگر قرار دهد و سایتی بسازد که قشنگ، کاربردی، سریع، امن و بدون خلل فنی باشد.
دراینجاست که اصول ساخت وب سایت به طراح و پیشرفتدهنده یاری میکند تا سایتی مهیا کند که هم جذاب و کاربردی و هم ایمن و سریع باشد.
مهمترین و کاربردی ترین اصول در وب طراحی صفحه
گذشتهاز پرداختن به اصول وب صفحه ارایی، بهاین نکته بایستی اشاره کنم که تعداد اصول طراحی وبسایت اختلافی هست. یعنی در منابع از اصول مختلفی نام برده شدهاست. درادامه، مهمترین اصول که در بیشتر منابع ذکر شده و برای طراحی وبسایت غالب و حرفهای ما یحتاج می باشد، معرفی میشود.
۱. در همه روند وب صفحه ارایی اهداف وبسایت می بایست درنظر گرفته شود
همانطور که اشاره کردم، هر سایتی رسیدن به اهدافی را دنبال میکند. بعضیاز اهداف مشترک در میان کلیهی وب سایتها می باشند (جذبکردن بازدیدکننده و ساختن تعامل رضایتبخش). بعضی اهداف دیگر براساس قضیه سایت مشخص می گردد:
چنانچه وب سایت سرگرمی و ویدئویی باشد، هدفش این است که تا می گردد بازدیدکننده را در سایت نگه دارااست.
درصورتیکه وب سایت فروشگاهی است، هدفش تبدیلکردن بازدیدکننده به مشتری و ارتقا فروش هست.
چنانچه سایت برای یک برند خاص طراحی می گردد و قرار هست آن کسبوکار و برند را نام گذاری کند، هدف سایت محافظت اعتبار و رده برند و همچنین معرفی کامل و درست آن کسبوکار می باشد.
۲. تارنما را نباید با هر محتوایی پر کرد
سایت در شرایطیکه جذابترین طراحی صفحه را داشته باشد ولی از محتوای مفید و کاربردی برای بازدیدکننده (یعنی محتوایی که برای کاربرش مهم هست و مخاطب برای دیدن و پیداکردن آن به وب سایت میآید) تهی باشد، غالب نخواهد شد. محتوای هر وب سایت بخشی از وب سایت میباشد و درنتیجه طراح تارنما می بایست بهاین مورد هم اعتنا کند که در سایت محتوای درست و مناسب باهدف آن قرار گیرد. دراینجاست که اصل اول به طراح امداد میکند: محتوای سایت باید مناسب باهدف سایت و همچنین کاربران وبسایت باشد. محتوای تارنما فروشگاهی با وبسایت خبری فرق دارد، چون هدف و مخاطبان تارنما فروشگاهی و خبری باهم فرق داراهستند.
۳. طراحی وب بایستی بی آلایش و اصیل باشد
هنگامی طراح وب سایت متوجه شد قرار می باشد با طراحی به چهچیزی برسد و نوع و کیفیت محتوای سایت را نیز مشخص و معلوم کرد، می بایست راجع به صفحه ارایی کلی و ساختار کلی تارنما تصمیم بگیرد. برای این تصمیمگیری طراح وبسایت باید بهیاد داشته باشد که اولا از سایتهای مشابه تقلید نکند و دوما ساختاری بی آلایش و نهچندان بغرنج را برای وب سایت درنظر بگیرد.
صراحت دارد که بیشتر سایتهای فروشگاهی یا خبری قالب مشابهی داراهستند، ولی وب دیزاینر باید خلاقانه از قالب و دیگر وب سایتهای مشابه و رقیب فاصله بگیرد. به دو تصویر زیر نگاه نمائید. هر دو متعلق به کاغذی اول دو تارنما خبری معتبر در فقید میباشند. شباهتهایی در دو سایت وجود داراست، اما هر مورد صفحه آرایی منحصر به فردبه خودشان را دارند. هر دو وبسایت ساختار بی آلایشای دارند که بازدیدکننده در یک نگاه آن را شعور میکند.
۴. وب طراحی صفحه باید براساس اصول طراحی رابط کاربری و طراحی تجربیات کاربری باشد
فلسفهی طراحی رابط کاربری و تجربه کاربری در وبسایت این میباشد که سایت براساس ترجیحات کاربر و آنطور که او تعامل و فهم شل و ولتر و سادهتری با یک وب سایت و قسمتهای گوناگون آن دارد، صفحه ارایی گردد. به عنوان مثال، سیستم Navigation یا ناوبری در تارنما بسیار اهمیت دارد. چون مستقیما بهاین مربوط میشود که کاربر چطور بخشهای گوناگون وب سایت را پیدا کند. در صورتیکه ناوبری در سایت و منوها حیرانکننده طراحی شده باشند، استفاده کننده چیزی را که میخواهد پیدا نمیکند و ناراضی تارنما را رخنه میکند. وب دیزاینر می تواند باکمکبه دست آوردن از طراح رابط کاربری و تجربه کاربری بهراحتی ناوبری سایت را طراحی کند. درواقع:
طراحی UI/UX رویه را برای طراح وبسایت باز میکند و به او نماد میدهد که برای دیزاین بصری و گزینش و به کارگیری از المانهای بصری سایت ازجمله رنگها، آیکونها، دکمهها، CTAها، فضاهای خالی، عکسها و گرافیکها، و همچنین طراحی منوها، تیمبندی تولیدات یا بخشهای مختلف وبسایت، طراحی سلسلهمراتب بصری و حتی متنها چهطور باید شغل کند تا تعامل کاربر با سایت به بهترین شکل انجام شود.
به تصویر تحت نگاه فرمایید. چه میبینید؟ دستهای حیرانکننده از المانهای مختلف که بیهیچ قاعده و تناسبی فقط کنار یکدیگر قرار گرفتند. رنگها، فونتها و سایز فونتهای استفادهشده قشنگ و جالب و متناسب نیستند. این وب سایت نمونهای از وبسایتی میباشد که فارغ ازدقت به هر ۴ مهم که تاکنون گفته شد، ساخته شده است. هر کاربری که وارد این وبسایت شود، مطلقا برای یکسری لحظه ماتومبهوت به همهچیز نگاه میکند. وقتی سایتی بیاعتنا به اصول طراحی صفحه گردد، استفاده کننده را گیج میکند و او را وادار میکند تا درنگ کند و وقت بگذارد تا چیزی را که میخواهد در آن پیدا کند.
۵. بااستفادهاز سیستم گرید در طرحبندی صفحات سایت هارمونی و نظم ایجاد می گردد
مغز و چشم انسان هارمونی، نظم، تقارن و تناسب میان چیزها (المانها) را ادراک میکند و دوست دارد. از مهمترین موضوعات در طرحبندی صفحه های سایت (Page layout) این می باشد که محتوا و دیگر المانهای بصری چه گونه درکنار یکدیگر چیده شوند تا کلیهچیز ساختارمند و منظم بهحیث برسد.
طرحبندی برگه و طریقای که وب دیزاینر برای آن استفاده میکند علاوهبر هارمونی و نظم بخشیدن به برگه، خواندن محتوا را برای کاربر راحت میکند. ازطرف دیگر، طراحی صفحه اصولی سایت به seo تارنما هم کمک میکند. برای گوگل، طرحبندی تارنما آنقدر اساسی می باشد که الگوریتمی به نام Page Layout دارد.
طراح تارنما از شیوهای مختلفی برای طرحبندی صفحه های سایت میتواند استفاده کند. اما بهترین گزینه این میباشد که از سیستم گرید (Grid based layout) امداد بگیرد. در سیستم گرید، شیت به دستهای از ستونها و ردیفها تقسیم میگردد. در هر ستون و ردیف هم Containerهایی برای قرارگرفتن المانها وجود دارد. طراح تارنما می تواند در هر Container المانها را درکنار یکدیگر بچیند.
دو تصویر زیر را نگاهی فرمایید. متوجه تفاوت در طرحبندی صفحهاول این دو تارنما شدید؟
مزایای طراحی سایت با وردپرس چیست؟